<template>
  <div class="hello">
  <swiper :modules="modules" :pagination="{ clickable: true }">
    <SwiperSlide>
      <img src="../assets/1.img.png" alt="">
    </SwiperSlide>
    <SwiperSlide>
      <img src="../assets/1.img.png" alt="">
    </SwiperSlide>
    <SwiperSlide>
      <img src="../assets/1.img.png" alt="">
    </SwiperSlide>
   
   
  </swiper>
    
  </div>
</template>

<script>

import {Swiper,SwiperSlide} from 'swiper/vue';
import { Pagination } from 'swiper';
import 'swiper/css';
import 'swiper/css/pagination';

export default {
 name: 'HelloWorld',
 data(){
  return{
   modules: [ Pagination ]
   }
  },
 components: { 
  Swiper,
  SwiperSlide,
  }
}
</script>


<style scoped>
img{
  width: 50%;
}
</style>
